import React, { Component } from 'react';
import { Table, Input, Tabs } from '@knownsec/react-component';
// import { getTask, cancelTask } from '~/API/index';
import Vul from './vul';
import Allevent from './allevent';
import Availability from './availability';
import SecurityEvent from './securityevent';
import Outlink from './outlink';
import { filterNull } from '@/utils';

import Info from './info';
import Appendix from './appendix';
import ChangeCheck from './changeCheck';
// import { DATA } from './data';
import { withRouter } from 'react-router-dom';
import s from './style.module.less';

let childPages = [
  { key: 'all', name: '综述', component: Allevent },
  { key: 'availability', name: '可用性', component: Availability },
  { key: 'securityEvent', name: '安全事件', component: SecurityEvent },
  { key: 'vul', name: '漏洞', component: Vul },
  { key: 'risk_link', name: '风险外链', component: Outlink },
  { key: 'change_check', name: '篡改', component: ChangeCheck },
  { key: 'target_info', name: '信息', component: Info },
  { key: 'dix', name: '附录', component: Appendix },
];
let childObj = {
  securityEvent: { name: '安全事件', component: SecurityEvent },
  vul: { name: '漏洞', component: Vul },
  risk_link: { name: '风险外链', component: Outlink },
  aviliable: { name: '可用性', component: Availability },
  change_check:{name: '篡改', component: ChangeCheck },

};
const { TabPane } = Tabs;

class Scanres extends Component {
  constructor(props) {
    super(props);
    this.timer = null;
    const prefilter = new URLSearchParams(props.location.search).get('filter')
    const filter = prefilter?JSON.parse(prefilter) || {}:{}
    this.state = {
      childTabs: childPages,
      dataList: { data: [], total: 0 },
      task_type: [],
      taskTotal: {},
      target_name: '',
      target_url: '',
      page: 1,
      limit: 10,
      locKeyNum: filter.locKeyNum||'综述',
      searchInfo: filter.searchInfo||'',
    };
  }

  componentDidUpdate(prevProps, preState) {
  }
  componentDidMount() {
    if (this.props.type && this.state.childTabs.length != 4) {
      const arr = [
        { name: '综述', component: Allevent },
        { name: '信息', component: Info },
        { name: '附录', component: Appendix },
      ];
      arr.splice(1, 0, childObj[this.props.type]);
      this.setState({ childTabs: arr });
    }
  }
  setVal(label, val) {
    this.setState({
      [label]: val,
    });
  }
  childFn(e) {
    const params = { locKeyNum: e.keyNum + '', vq: {risk_url: e.searchInfo }}
    this.setState(params);
    const f = JSON.stringify(filterNull(params))
    this.props.history.replace(`/dashboard/?id=${this.props.targetId}&sid=${this.props.sid || ''}&filter=${encodeURI(f)}&type=${this.props.type || ''}`)
  }
  render() {
    const { task_type_status_maps } = this.props?.data
    const { childTabs, locKeyNum, searchInfo } = this.state;
    return this.props.targetId ? (
      <Tabs
        activeKey={locKeyNum}
        tabBarStyle={{
          backgroundColor: '#ffffff',
          fontSize: 14,
          fontWeight: 400,
          color: '#1E1F23',
          borderColor: '#ffffff',
          marginBottom: '0',
        }}
        onTabClick={(e) => {
            const d = { locKeyNum: e }
            this.setState(d);
            const f = JSON.stringify(filterNull(d))
            this.props.history.replace(`/dashboard/?id=${this.props.targetId}&type=${this.props.type || ''}&sid=${this.props.sid || ''}&filter=${encodeURI(f)}`)
        }}
      >
        {childTabs.map((child, index) => {
          let { key, name, component: Comp } = child;
          return (
            <TabPane tab={name} key={name}>
              <Comp
                // data={DATA}
                fetchable={task_type_status_maps[key] || true}
                avaCloud={key === 'availability' ? task_type_status_maps['availability_cloud'] === 'ok' :true}
                show={this.props?.show}
                targetId={this.props.targetId}
                alleventData={this.props?.data}
                type={this.props.type}
                sid={this.props.sid}
                searchInfo={searchInfo}
                pfn={this.childFn.bind(this)}
              />
            </TabPane>
          );
        })}
      </Tabs>
    ) : null;
  }
}

export default withRouter(Scanres);
